<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<link rel="shortcut icon" href="favicon.ico">
<link href="${ctx!}/assets/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
<link href="${ctx!}/assets/css/font-awesome.css?v=4.4.0" rel="stylesheet">

<link href="${ctx!}/assets/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">

<link href="${ctx!}/assets/css/animate.css" rel="stylesheet">
<link href="${ctx!}/assets/css/style.css?v=4.1.0" rel="stylesheet">
<link href="${ctx!}/assets/css/admin-main.css" rel="stylesheet">
<body>
<div style="margin-top:10px;margin-left:10px;display:inline-block;float:left;width: 48%;height:70%;border: 1px solid black;border-radius: 5px;overflow: auto;">
    <p style="font-size: 16px;margin-left: 40%;font-weight: bolder;">供暖能效之供暖能耗-采集点配置</p>
    <div style="display: inline">
        <a href="javascript:void(0);" style="display:inline-block;margin-left: 50px;" class="a_add" id="add_box"
           onclick="addHTML(1);">添加采集点</a>
    </div>
    <div class="wrapper wrapper-content  animated fadeInRight">
        <table id="heating_powercost_list" class="table_style table-striped" style="margin: 0 auto">
        </table>
    </div>
</div>
<div style="margin-top:10px;margin-right:10px;display:inline-block;float:right;width: 48%;height:70%;border: 1px solid black;border-radius: 5px;overflow: auto;">
    <p style="font-size: 16px;margin-left: 40%;font-weight: bolder;">制冷能效之制冷能耗-采集点配置</p>
    <div style="display: inline">
        <a href="javascript:void(0);" style="display:inline-block;margin-left: 50px;" class="a_add" id="add_box"
           onclick="addHTML(2);">添加采集点</a>
    </div>
    <div class="wrapper wrapper-content  animated fadeInRight">
        <table id="cooling_powercost_list" class="table_style table-striped" style="margin: 0 auto">
        </table>
    </div>
</div>
<div style="margin-top:10px;margin-left:10px;display:inline-block;float:left;width: 48%;height:70%;border: 1px solid black;border-radius: 5px;overflow: auto;">
    <p style="font-size: 16px;margin-left: 40%;font-weight: bolder;">供暖能效之供暖量-采集点配置</p>
    <div style="display: inline">
        <a href="javascript:void(0);" style="display:inline-block;margin-left: 50px;" class="a_add" id="add_box"
           onclick="addHTML(3);">添加采集点</a>
    </div>
    <div class="wrapper wrapper-content  animated fadeInRight">
        <table id="heating_energy_list" class="table_style table-striped" style="margin: 0 auto">
        </table>
    </div>
</div>
<div style="margin-top:10px;margin-right:10px;display:inline-block;float:right;width: 48%;height:70%;border: 1px solid black;border-radius: 5px;overflow: auto;">
    <p style="font-size: 16px;margin-left: 40%;font-weight: bolder;">制冷能效之制冷量-采集点配置</p>
    <div style="display: inline">
        <a href="javascript:void(0);" style="display:inline-block;margin-left: 50px;" class="a_add" id="add_box"
           onclick="addHTML(4);">添加采集点</a>
    </div>
    <div class="wrapper wrapper-content  animated fadeInRight">
        <table id="cooling_energy_list" class="table_style table-striped" style="margin: 0 auto">
        </table>
    </div>
</div>
<div style="margin-top:10px;margin-left:10px;display:inline-block;float:left;width: 48%;height:70%;border: 1px solid black;border-radius: 5px;overflow: auto;">
    <p style="font-size: 16px;margin-left: 40%;font-weight: bolder;">能耗占比-采集点配置</p>
    <div style="display: inline">
        <a href="javascript:void(0);" style="display:inline-block;margin-left: 50px;" class="a_add" id="add_box"
           onclick="addOrEditPowercostRateTypeHTML();">添加能耗占比分析类别</a>
    </div>
    <div class="wrapper wrapper-content  animated fadeInRight">
        <table id="powercost_rate_list" class="table_style table-striped" style="margin: 0 auto">
        </table>
    </div>
</div>
<div style="margin-top:10px;margin-right:10px;display:inline-block;float:right;width: 48%;height:70%;border: 1px solid black;border-radius: 5px;overflow: auto;">
    <p style="font-size: 16px;margin-left: 40%;font-weight: bolder;">机组能效-采集点配置</p>
    <div style="display: inline">
        <a href="javascript:void(0);" style="display:inline-block;margin-left: 50px;" class="a_add" id="add_box"
           onclick="addOrEditMachineGroupHTML();">添加机组名称</a>
    </div>
    <div class="wrapper wrapper-content  animated fadeInRight">
        <table id="machine_group_list" class="table_style table-striped" style="margin: 0 auto">
        </table>
    </div>
</div>
<div style="margin-top:10px;margin-left:10px;display:inline-block;float:left;width: 48%;height:70%;border: 1px solid black;border-radius: 5px;overflow: auto;">
    <p style="font-size: 16px;margin-left: 40%;font-weight: bolder;">系统能耗指标之供暖模式-采集点配置</p>
    <div style="display: inline">
        <a href="javascript:void(0);" style="display:inline-block;margin-left: 50px;" class="a_add" id="add_box"
           onclick="addHTML(9);">添加采集点</a>
    </div>
    <div class="wrapper wrapper-content  animated fadeInRight">
        <table id="heating_powercost_std_list" class="table_style table-striped" style="margin: 0 auto">
        </table>
    </div>
</div>
<div style="margin-top:10px;margin-right:10px;display:inline-block;float:right;width: 48%;height:70%;border: 1px solid black;border-radius: 5px;overflow: auto;">
    <p style="font-size: 16px;margin-left: 40%;font-weight: bolder;">系统能耗指标之制冷模式-采集点配置</p>
    <div style="display: inline">
        <a href="javascript:void(0);" style="display:inline-block;margin-left: 50px;" class="a_add" id="add_box"
           onclick="addHTML(8);">添加采集点</a>
    </div>
    <div class="wrapper wrapper-content  animated fadeInRight">
        <table id="cooling_powercost_std_list" class="table_style table-striped" style="margin: 0 auto">
        </table>
    </div>
</div>
<div style="margin-top:10px;margin-left:10px;display:inline-block;float:left;width: 48%;height:70%;border: 1px solid black;border-radius: 5px;overflow: auto;">
    <p style="font-size: 16px;margin-left: 40%;font-weight: bolder;">可在生能源利用量-采集点配置(首页)</p>
    <div style="display: inline">
        <a href="javascript:void(0);" style="display:inline-block;margin-left: 50px;" class="a_add" id="add_box"
           onclick="addHTML(5);">添加采集点</a>
    </div>
    <div class="wrapper wrapper-content  animated fadeInRight">
        <table id="renew_energy_list" class="table_style table-striped" style="margin: 0 auto">
        </table>
    </div>
</div>
<div style="margin-top:10px;margin-right:10px;display:inline-block;float:right;width: 48%;height:70%;border: 1px solid black;border-radius: 5px;overflow: auto;">
    <p style="font-size: 16px;margin-left: 40%;font-weight: bolder;">节约标煤量-采集点配置(首页)</p>
    <div style="display: inline">
        <a href="javascript:void(0);" style="display:inline-block;margin-left: 50px;" class="a_add" id="add_box"
           onclick="addHTML(6);">添加采集点</a>
    </div>
    <div class="wrapper wrapper-content  animated fadeInRight">
        <table id="coal_saved_list" class="table_style table-striped" style="margin: 0 auto">
        </table>
    </div>
</div>
<div style="margin-top:10px;margin-left:10px;display:inline-block;float:left;width: 48%;height:70%;border: 1px solid black;border-radius: 5px;overflow: auto;">
    <p style="font-size: 16px;margin-left: 40%;font-weight: bolder;">碳排放量-采集点配置(首页)</p>
    <div style="display: inline">
        <a href="javascript:void(0);" style="display:inline-block;margin-left: 50px;" class="a_add" id="add_box"
           onclick="addHTML(7);">添加采集点</a>
    </div>
    <div class="wrapper wrapper-content  animated fadeInRight">
        <table id="carbon_emission_list" class="table_style table-striped" style="margin: 0 auto">
        </table>
    </div>
</div>


</body>
<div style="float:left;width:100%;height: 40px;"></div>

<script src="${ctx!}/assets/js/jquery.min.js?v=2.1.4"></script>
<script src="${ctx!}/assets/js/bootstrap.min.js?v=3.3.6"></script>
<script src="${ctx!}/assets/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
<script src="${ctx!}/assets/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
<script src="${ctx!}/assets/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
<script src="${ctx!}/assets/js/plugins/peity/jquery.peity.min.js"></script>
<script src="${ctx!}/assets/js/plugins/layer/layer.min.js"></script>
<script src="${ctx!}/assets/js/content.js?v=1.0.0"></script>
<script>
    $(function () {
        initTable("#heating_powercost_list", "heating_powercost_device")
        initTable("#cooling_powercost_list", "cooling_powercost_device")
        initTable("#heating_powercost_std_list", "heating_powercost_std_device")
        initTable("#cooling_powercost_std_list", "cooling_powercost_std_device")
        initTable("#heating_energy_list", "heating_energy_device")
        initTable("#cooling_energy_list", "cooling_energy_device")
        initTable("#renew_energy_list", "renew_energy_device")
        initTable("#coal_saved_list", "coal_saved_device")
        initTable("#carbon_emission_list", "carbon_emission_device")
        initTableTwoLevel("#powercost_rate_list", "${ctx!}/admin/statistics/config/statistics_powercost_rate_type/${projectId}")
        initTableTwoLevel2("#machine_group_list", "${ctx!}/admin/statistics/config/statistics_machine_group/${projectId}")
    });

    function initTable(id, url) {
        //初始化表格,动态从服务器加载数据
        $(id).bootstrapTable({
            //使用get请求到服务器获取数据
            method: "GET",
            //必须设置，不然request.getParameter获取不到请求参数
            contentType: "application/x-www-form-urlencoded",
            //获取数据的Servlet地址
            url: "${ctx!}/admin/statistics/config/" + url + "/${projectId}",
            //表格显示条纹
            striped: true,
            //是否启用详情页
            detailView: false,
            sidePagination: "server",
            responseHandler: function (response) {
                if (response.success) {
                    rows = response.data.config
                    total = response.data.config.length
                    data = {
                        'rows': rows,
                        'total': total
                    };
                    return data
                } else {
                    layer.msg("加载失败," + data.massage)
                }
            },
            //数据列
            columns: [
                {
                    title: "采集点名称",
                    field: "device.name",
                    width: 150,
                }, {
                    title: "操作",
                    field: "empty",
                    width: 150,
                    formatter: function (value, row, index) {
                        operateHtml = '<button class="btn btn-danger btn-xs" type="button" onclick="deleteStatisticsConfig(' + row.id + ')"><i class="fa fa-remove"></i>&nbsp;删除</button>';
                        return operateHtml;
                    }
                }]
        });
    }

    /**
     * 能耗占比
     * */
    function initTableTwoLevel(id, url) {
        //初始化表格,动态从服务器加载数据
        $(id).bootstrapTable('destroy')
        $(id).bootstrapTable({
            //使用get请求到服务器获取数据
            method: "GET",
            //必须设置，不然request.getParameter获取不到请求参数
            contentType: "application/x-www-form-urlencoded",
            //获取数据的Servlet地址
            url: url,
            //表格显示条纹
            striped: true,
            //是否启用详情页
            detailView: true,
            sidePagination: "server",
            responseHandler: function (response) {
                if (response.success) {
                    rows = response.data.groups
                    total = response.data.groups.length
                    data = {
                        'rows': rows,
                        'total': total
                    };
                    return data
                } else {
                    layer.msg("加载失败," + data.massage)
                }
            },
            //数据列
            columns: [
                {
                    title: "能耗占比分析类别名称",
                    field: "name",
                    width: 150,
                }, {
                    title: "操作",
                    field: "empty",
                    width: 150,
                    formatter: function (value, row, index) {
                        operateHtml = '<button class="btn btn-danger btn-xs" type="button" onclick="deleteStatisticsPowercostRateType(' + row.id + ')"><i class="fa fa-remove"></i>&nbsp;删除</button>';
                        operateHtml += '<button class="btn btn-primary btn-xs" type="button" onclick="addOrEditPowercostRateTypeHTML(\'' + row.id + '\')"><i class="fa fa-edit"></i>&nbsp;修改</button> &nbsp;';
                        operateHtml += '<button class="btn btn-primary btn-xs" type="button" onclick="addOnPowercostRateConfig(\'' + row.id + '\')"><i class="fa fa-edit"></i>&nbsp;添加采集点</button> &nbsp;';
                        return operateHtml;
                    }
                }],
            onExpandRow: function (index, row, $detail) {
                initSubTable(index, row, $detail);
            }
        });
    }

    initSubTable = function (index, row, $detail) {
        var html = "<table id='sub_table_list" + index + "' class=\"table_style table-striped\" style=\"margin: 0 auto\"></table>"
        $detail.html(html)
        $("#sub_table_list" + index).bootstrapTable({
            //使用get请求到服务器获取数据
            method: "GET",
            //必须设置，不然request.getParameter获取不到请求参数
            contentType: "application/x-www-form-urlencoded",
            //获取数据的Servlet地址
            url: "${ctx!}/admin/statistics/config/statistics_powercost_rate_config/" + row.id,
            //表格显示条纹
            striped: true,
            //是否启用详情页
            sidePagination: "server",
            responseHandler: function (response) {
                if (response.success) {
                    rows = response.data.configs
                    total = response.data.configs.length
                    data = {
                        'rows': rows,
                        'total': total
                    };
                    return data
                } else {
                    layer.msg("加载失败," + data.massage)
                }
            },
            //数据列
            columns: [
                {
                    title: "下属采集点",
                    field: "device.name",
                    width: 120,
                }, {
                    title: "操作",
                    field: "empty",
                    width: 120,
                    formatter: function (value, row, index) {
                        operateHtml = '<button class="btn btn-danger btn-xs" type="button" onclick="deleteStatisticsPowercostRateConfig(' + row.id + ')"><i class="fa fa-remove"></i>&nbsp;删除</button>';
                        return operateHtml;
                    }
                }],
        })
    }


    /**
     * 机组
     * @param id
     * @param url
     */
    function initTableTwoLevel2(id, url) {
        //初始化表格,动态从服务器加载数据
        $(id).bootstrapTable('destroy')
        $(id).bootstrapTable({
            //使用get请求到服务器获取数据
            method: "GET",
            //必须设置，不然request.getParameter获取不到请求参数
            contentType: "application/x-www-form-urlencoded",
            //获取数据的Servlet地址
            url: url,
            //表格显示条纹
            striped: true,
            //是否启用详情页
            detailView: true,
            sidePagination: "server",
            responseHandler: function (response) {
                if (response.success) {
                    rows = response.data.groups
                    total = response.data.groups.length
                    data = {
                        'rows': rows,
                        'total': total
                    };
                    return data
                } else {
                    layer.msg("加载失败," + data.massage)
                }
            },
            //数据列
            columns: [
                {
                    title: "机组名称",
                    field: "name",
                    width: 150,
                }, {
                    title: "操作",
                    field: "empty",
                    width: 150,
                    formatter: function (value, row, index) {
                        operateHtml = '<button class="btn btn-danger btn-xs" type="button" onclick="deleteMachineGroup(' + row.id + ')"><i class="fa fa-remove"></i>&nbsp;删除</button>';
                        operateHtml += '<button class="btn btn-primary btn-xs" type="button" onclick="addOrEditMachineGroupHTML(\'' + row.id + '\')"><i class="fa fa-edit"></i>&nbsp;修改</button> &nbsp;';
                        operateHtml += '<button class="btn btn-primary btn-xs" type="button" onclick="addOnMachineGroupConfig(\'' + row.id + '\')"><i class="fa fa-edit"></i>&nbsp;添加采集点</button> &nbsp;';
                        return operateHtml;
                    }
                }],
            onExpandRow: function (index, row, $detail) {
                initSubTable2(index, row, $detail);
            }
        });
    }

    initSubTable2 = function (index, row, $detail) {
        var html = "<table id='sub_table_list_" + index + "' class=\"table_style table-striped\" style=\"margin: 0 auto\"></table>"
        html += "<table id='sub_table_list__" + index + "' class=\"table_style table-striped\" style=\"margin: 0 auto\"></table>"
        $detail.html(html)
        $("#sub_table_list_" + index).bootstrapTable({
            //使用get请求到服务器获取数据
            method: "GET",
            //必须设置，不然request.getParameter获取不到请求参数
            contentType: "application/x-www-form-urlencoded",
            //获取数据的Servlet地址
            url: "${ctx!}/admin/statistics/config/statistics_machine_group_config/" + row.id + "/0",
            //表格显示条纹
            striped: true,
            //是否启用详情页
            sidePagination: "server",
            responseHandler: function (response) {
                if (response.success) {
                    rows = response.data.configs
                    total = response.data.configs.length
                    data = {
                        'rows': rows,
                        'total': total
                    };
                    return data
                } else {
                    layer.msg("加载失败," + data.massage)
                }
            },
            //数据列
            columns: [
                {
                    title: "下属能耗采集点",
                    field: "device.name",
                    width: 120,
                }, {
                    title: "操作",
                    field: "empty",
                    width: 120,
                    formatter: function (value, row, index) {
                        operateHtml = '<button class="btn btn-danger btn-xs" type="button" onclick="deleteMachineGroupConfig(' + row.id + ')"><i class="fa fa-remove"></i>&nbsp;删除</button>';
                        return operateHtml;
                    }
                }],
        });
        $("#sub_table_list__" + index).bootstrapTable({
            //使用get请求到服务器获取数据
            method: "GET",
            //必须设置，不然request.getParameter获取不到请求参数
            contentType: "application/x-www-form-urlencoded",
            //获取数据的Servlet地址
            url: "${ctx!}/admin/statistics/config/statistics_machine_group_config/" + row.id + "/1",
            //表格显示条纹
            striped: true,
            //是否启用详情页
            sidePagination: "server",
            responseHandler: function (response) {
                if (response.success) {
                    rows = response.data.configs
                    total = response.data.configs.length
                    data = {
                        'rows': rows,
                        'total': total
                    };
                    return data
                } else {
                    layer.msg("加载失败," + data.massage)
                }
            },
            //数据列
            columns: [
                {
                    title: "下属制冷量(供暖量)采集点",
                    field: "device.name",
                    width: 120,
                }, {
                    title: "操作",
                    field: "empty",
                    width: 120,
                    formatter: function (value, row, index) {
                        operateHtml = '<button class="btn btn-danger btn-xs" type="button" onclick="deleteMachineGroupConfig(' + row.id + ')"><i class="fa fa-remove"></i>&nbsp;删除</button>';
                        return operateHtml;
                    }
                }],
        })
    }


    function deleteStatisticsConfig(statisticsConfigId) {
        layer.confirm("是否确认删除", {
            btn: ['确认', '取消']
        }, function () {
            $.ajax({
                method: "DELETE",
                url: "${ctx!}/admin/statistics/config/delete/" + statisticsConfigId,
                success: function (data) {
                    data = eval('(' + data + ')')
                    if (data.success) {
                        layer.msg(data.message)
                        $(".table_style").each(function () {
                            $(this).bootstrapTable("refresh")
                        });
                    } else {
                        layer.msg(data.message)
                    }
                }
            })
        }, function () {
            // 按钮2的事件
        })
    }

    function deleteMachineGroup(machineGroupId) {
        layer.confirm("是否确认删除", {
            btn: ['确认', '取消']
        }, function () {
            $.ajax({
                method: "DELETE",
                url: "${ctx!}/admin/statistics/config/statistics_machine_group/delete/" + machineGroupId,
                success: function (data) {
                    data = eval('(' + data + ')')
                    if (data.success) {
                        layer.msg(data.message)
                        $(".table_style").each(function () {
                            $(this).bootstrapTable("refresh")
                        });
                        // location.reload()
                    } else {
                        layer.msg(data.message)
                    }
                }
            })
        }, function () {
            // 按钮2的事件
        })

    }


    function deleteStatisticsPowercostRateType(statisticsPowercostRateTypeId) {
        layer.confirm("是否确认删除", {
            btn: ['确认', '取消']
        }, function () {
            $.ajax({
                method: "DELETE",
                url: "${ctx!}/admin/statistics/config/statistics_powercost_rate_type/delete/" + statisticsPowercostRateTypeId,
                success: function (data) {
                    data = eval('(' + data + ')')
                    if (data.success) {
                        layer.msg(data.message)
                        $(".table_style").each(function () {
                            $(this).bootstrapTable("refresh")
                        });
                        // location.reload()
                    } else {
                        layer.msg(data.message)
                    }
                }
            })
        }, function () {
            // 按钮2的事件
        })

    }

    function deleteStatisticsPowercostRateConfig(statisticsPowercostConfigId) {
        layer.confirm("是否确认删除", {
            btn: ['确认', '取消']
        }, function () {
            $.ajax({
                method: "DELETE",
                url: "${ctx!}/admin/statistics/config/statistics_powercost_rate_config/delete/" + statisticsPowercostConfigId,
                success: function (data) {
                    data = eval('(' + data + ')')
                    if (data.success) {
                        $(".table_style").each(function () {
                            $(this).bootstrapTable("refresh")
                        });
                        // location.reload()
                        layer.msg(data.message)
                    } else {
                        layer.msg(data.message)
                    }
                }
            })
        }, function () {
            // 按钮2的事件
        })

    }

    function deleteMachineGroupConfig(machineGroupConfigId) {
        layer.confirm("是否确认删除", {
            btn: ['确认', '取消']
        }, function () {
            $.ajax({
                method: "DELETE",
                url: "${ctx!}/admin/statistics/config/statistics_machine_group_config/delete/" + machineGroupConfigId,
                success: function (data) {
                    data = eval('(' + data + ')')
                    if (data.success) {
                        $(".table_style").each(function () {
                            $(this).bootstrapTable("refresh")
                        });
                        // location.reload()
                        layer.msg(data.message)
                    } else {
                        layer.msg(data.message)
                    }
                }
            })
        }, function () {
            // 按钮2的事件
        })

    }

    function addHTML(statisticsTypeId) {
        layer.open({
            type: 2,
            title: "添加统计采集点",
            shadeClose: true,
            shade: false,
            area: ['400px', '210px'],
            content: '${ctx!}/admin/statistics/config/add/${projectId}/' + statisticsTypeId,
            end: function () {
                location.reload()
            }
        });
    }

    function addOnMachineGroupConfig(machineGroupId) {
        layer.open({
            type: 2,
            title: "添加统计采集点",
            shadeClose: true,
            shade: false,
            area: ['400px', '250px'],
            content: '${ctx!}/admin/statistics/config/machine_group_config/add/${projectId}/' + machineGroupId,
            end: function () {
                location.reload()
            }
        });
    }

    function addOnPowercostRateConfig(statisticsPowercostRateTypeId) {
        layer.open({
            type: 2,
            title: "添加统计采集点",
            shadeClose: true,
            shade: false,
            area: ['400px', '210px'],
            content: '${ctx!}/admin/statistics/config/powercost_rate_config/add/${projectId}/' + statisticsPowercostRateTypeId,
            end: function () {
                location.reload()
            }
        });
    }

    function addOrEditPowercostRateTypeHTML(typeId) {
        if (null == typeId) {
            title = "添加能耗占比分析类别"
            url = '${ctx!}/admin/statistics/config/statistics_powercost_rate_type/add_edit/${projectId}'
        } else {
            title = "修改能耗占比分析类别"
            url = '${ctx!}/admin/statistics/config/statistics_powercost_rate_type/add_edit/${projectId}/?statisticsPowercostRateTypeId=' + typeId
        }

        layer.open({
            type: 2,
            title: title,
            shadeClose: true,
            shade: false,
            area: ['400px', '210px'],
            content: url,
            end: function () {
                location.reload()
            }
        });
    }

    function addOrEditMachineGroupHTML(machineGroupId) {
        if (null == machineGroupId) {
            title = "添加机组"
            url = '${ctx!}/admin/statistics/config/statistics_machine_group/add_edit/${projectId}'
        } else {
            title = "修改机组"
            url = '${ctx!}/admin/statistics/config/statistics_machine_group/add_edit/${projectId}?machineGroupId=' + machineGroupId
        }

        layer.open({
            type: 2,
            title: title,
            shadeClose: true,
            shade: false,
            area: ['400px', '210px'],
            content: url,
            end: function () {
                location.reload()
            }
        });
    }

</script>
</html>